<template>
  <div id="uesrtext">
    <textarea placeholder="按 Ctrl + Enter 发送" v-model="content" v-on:keyup="addMessage"></textarea>
  </div>
</template>

<script>
import {mapState} from 'vuex'

export default {
  name: 'uesrtext',
  data () {
    return {
      content:''
    }
  }, computed: mapState([
    'sessions',
    'currentSession'
  ]),
  methods: {
  	addMessage (e) {
  		if (e.ctrlKey && e.keyCode ===13 && this.content.length) { //这个就是控制输入方法触发事件的方法
          console.info("usertext fangfa addMessagezhixing ");
           /***模拟发送消息
          let msgObj = new Object();
          msgObj.to='libai';
          msgObj.content= this.content;

          console.info("this.content:"+this.content);
          console.info("fasongde nerogn "+JSON.stringify(msgObj));
            **/
           let msgObj = new Object();
          console.info("this.currentSession.username"+this.currentSession);
          msgObj.to = this.currentSession.username;
          msgObj.content = this.content;
          //新添加的发送消息的方法  第一个参数发送位置  第二个参数优先级信息  第三个消息的内容
          this.$store.state.stomp.send('/ws/chat', {}, JSON.stringify(msgObj));
         //以前发送的内容是this.content;
  		 this.$store.commit('addMessage',msgObj); //发送以后 把内容添加到addMessage中
  		  this.content='';
  		}
  	}
  }
}
</script>

<style lang="scss" scoped>
#uesrtext {
	position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 30%;
  border-top: solid 1px #DDD;
  > textarea {
  	padding: 10px;
  	width: 100%;
  	height: 100%;
  	border: none;
  	outline: none;
  }
}
</style>
